<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.thymeleaf.org/extras/dialect"
      layout:decorate="layout/layout_info"
>
<head>
	<title>登录历史</title>
	<meta charset="utf-8"/>
	<link rel="stylesheet" href="../../static/asset/css/form.min.css" th:href="@{/asset/css/form.min.css}"/>
	<link rel="stylesheet" href="../../static/asset/css/common/front.css" th:href="@{/asset/css/common/front.css}"/>
	<link rel="stylesheet" href="../../static/asset/css/front/user-center.css" th:href="@{/asset/css/front/user-center.css}"/>
</head>
<body>
<div layout:fragment="content" th:remove="tag">
	<div class="container-fluid display-flex p-0" style="flex: 1 1;">
		<div class="row no-gutters w-100">
			<div class="col-12 col-md-2" th:insert="layout/menus::submenu(${menus},0,'Front_Login_History')" style="background: #3c3c3c;">
			</div>

			<div class="col-12 col-md-10">
				<div class="row no-gutters">
					<div class="col-md-12">

						<div class="card">
							<div class="card-header">
								最近登录（显示最近10条）
							</div>
							<div class="card-body">
								<table id="dataTable" class="table responsive table-bordered table-hover" cellspacing="0" width="100%">
									<thead>
									<tr>
										<th class="all">
											#
											<!--<label class="custom-control custom-checkbox">-->
											<!--<input id="check-all" type="checkbox" class="custom-control-input">-->
											<!--<span class="custom-control-indicator"></span>-->
											<!--</label>-->
										</th>
										<th>LOGO</th>
										<th>登录系统</th>
										<th>登录时间</th>
										<th>登录IP</th>
										<th>退出时间</th>
									</tr>
									</thead>
									<tbody></tbody>
									<tfoot></tfoot>
								</table>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<th:block layout:fragment="libs-script">
	<script type="text/javascript" src="../../../static/asset/js/form.min.js" th:src="@{/asset/js/form.min.js}"></script>
	<script type="text/javascript" src="../../../static/asset/js/datatables.min.js" th:src="@{/asset/js/datatables.min.js}"></script>
	<script type="text/javascript" src="../../../static/asset/js/common/dataTables.ext.js" th:src="@{/asset/js/common/dataTables.ext.js}"></script>
</th:block>
<th:block layout:fragment="script">
	<script type="text/javascript">
        /*<![CDATA[*/
        var creatorId = [[${#authentication.principal.userId}]];
        var contextPath = '[[${#httpServletRequest.getContextPath()}]]';
        /*]]>*/
        $(function () {
            $('#dataTable').on('preXhr.dt', function (e, settings, data) {
                data['filter[tmtUser.id]'] = creatorId;
            });

            $('#dataTable').DataTable({
                select: true,
                autoWidth: false,
                ajax: {
                    "url": contextPath + '/login-history/list/data', // ajax source
                    "type": 'post'
                },
                buttons: [],
                columns: [
                    {
                        data: "id",
                    },
                    {
                        data: "originSystem.logo",
                        orderable: false,
                        visible: true,
                        render: function (data, type, row, meta) {
                            return '<img title="型号图片" style="width:30px; height:30px;" src="' + data + '"/>';
                        }
                    },
                    {
                        data: "originSystem.name",
                        orderable: false,
                        visible: true
                    },
                    {
                        data: "createTime",
                    },
                    {
                        data: "ipAddress",
                        orderable: false,
                        visible: true
                    },
                    {
                        data: "logoutTime",
                        orderable: false,
                        visible: true
                    }
                ],
                order: [0, "desc"],
            });
        });
	</script>
</th:block>
</body>
</html>
